
.px2rem(@name, @px) {
    @{name}: @px / 75 * 1rem;
}



.header{
    display: flex;
    
    .px2rem(height,90);

    background: #c50000;
    align-items: center;
    .left{
        padding-left: 10px;
    }
    
    .center{
//      flex: 1;
        display: flex;
        justify-content: space-between;
        text-align: center;
        margin: 0 auto;
        .left{

            text-align: center;
            .px2rem(margin-right,20);

//          background: linear-gradient(top,#f9f9f9,#949494);
            
            background: #f9f9f9;
            .px2rem(width,150);
            .px2rem(font-size,38);
            .px2rem(border-radius,10);
           
        }
        .right{

            text-align: center;
            .px2rem(margin-left,20);
//          background: linear-gradient(top,#fc7373,#ac1818);
            background: #ac1818;
            color: white;
            .px2rem(width,150);
            .px2rem(font-size,38);
            .px2rem(border-radius,10);
        }
        
    }
    
    
}



.section{
    .class{
        .list{
            display: flex;
            align-items: center;
            .px2rem(height,80);
            .left{
               flex: 1;
               text-align: left;
               .px2rem(padding-left,20);
            }
            .right{
                flex: 1;
                text-align: right;
                .px2rem(padding-right,20);
            }
             &:nth-child(2n-1){
            background: #ededed;
        }
            
            
        }
        
       
        
    }
    
    
    
    
    .class-one{
        .list{
            display: flex;
            .left{
                flex: 1;
                display: flex;
                flex-direction: column;
                text-align: left;
                justify-content: center;
                .px2rem(height,80);
                .px2rem(padding-left,20);
                .head{
                   .px2rem(font-size,28);
                   .px2rem(padding-left,20);
                   
                }
                
                .foot{
                    .px2rem(font-size,28);
                   .px2rem(padding-left,20);
                }
                
            }
            
            .right{
              .px2rem(padding,20);
            }
            
            &:nth-child(2n+1){
            background: #ededed;
            }
        }
    }
}



.footer {
    position: fixed;
    width: 100%;
    .px2rem(bottom,0);
    .nav {
        margin: 0 auto;
        display: flex;
        background: black;
        li{
            flex: 1;
            display: flex;
            flex-direction: column;
            .px2rem(height,100);
            .px2rem(margin-top,5);
            .px2rem(margin-left,20);
            .px2rem(margin-right,20);
            .px2rem(margin-bottom,5);
            .px2rem(border-radius,5);
            align-items: center;
           
            .img {
                .px2rem(margin-top,5)
            }
            .title {
                text-align: center;
                color: white;
            }
            
            &.show{
                background: #6f6f6f;
            }
        }
        
       
        
        
    }
}






















